<template>
  <nav id="nav">
    <div>
      <h1>
        <a href="###" class="logo">王者荣耀</a>
      </h1>
      <ul>
        <li><a href="/">官网首页</a><em>HOME</em></li>
        <li><a href="/yxjs">游戏介绍</a><em>DATA</em></li>
        <li><a href="/yxgl">游戏攻略</a><em>STRATEGY</em></li>
        <li><a href="/wzyyt">王者音乐听</a><em>MUSIC</em></li>
        <li><a href="/yxbz">游戏壁纸</a><em>WALLPAPER</em></li>
        <li><a href="/djhj">对局环境</a><em>CONFRONTATION</em></li>
      </ul>
    </div>
  </nav>
  <header id="header" style="background-color:rgba(0,0,0,.8)">
    <div class="zynr">
      <div class="yybt1">
        <img src="../assets/img/wzyyt/yxysd.png" width="680">
      </div>
      <ul class="yybt2">
        <li><a href=""><img src="../assets/img/wzyyt/yxyybtt1.jpg" width="475" height="151"></a></li>
        <li><a href=""><img src="../assets/img/wzyyt/yxyybtt2.jpg" width="475" height="151"></a></li>
      </ul>
      <div class="yybt3">
        <ul>
          <li>
            <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
            <img src="../assets/img/wzyyt/yyfm1.jpg" width="102" height="102" style="float: left;margin-top:-102px;">
          </li>
          <li>
            <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
            <img src="../assets/img/wzyyt/yyfm2.jpg" width="102" height="102" style="float: left;margin-top:-102px;">
          </li>
          <li>
            <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
            <img src="../assets/img/wzyyt/yyfm3.jpg" width="102" height="102" style="float: left;margin-top:-102px;">
          </li>
          <li>
            <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
            <img src="../assets/img/wzyyt/yyfm4.jpg" width="102" height="102" style="float: left;margin-top:-102px;">
          </li>
          <li>
            <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
            <img src="../assets/img/wzyyt/yyfm5.jpg" width="102" height="102" style="float: left;margin-top:-102px;">
          </li>
          <li>
            <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
            <img src="../assets/img/wzyyt/yyfm6.jpg" width="102" height="102" style="float: left;margin-top:-102px;">
          </li>
        </ul>
      </div>
      <div class="yybt4">
        <div class="yynr1">
          <img src="../assets/img/wzyyt/yyfmbj.png" width="360" height="360" style="float: left;padding-left: 220px;">
          <img src="../assets/img/wzyyt/yyfm6.jpg" width="372" height="372" style="float: left;border-radius: 10px;margin-top: -372px;">
        </div>
        <div class="yynr2">
          <p style="margin-bottom: 20px;opacity: 0.4;">曲目列表</p>
          <p>王者冰刃</p>
          <p>永远的长安城</p>
          <p>王者雪魄</p>
        </div>
      </div>

    </div>
  </header>

  <footer id="footer" style=" position: relative;top: -100px;width:1880px">
    <audio src="/audio/王者冰刃.mp3" autoplay controls loop style="width: 90%;margin-left: 60px;">对不起，你的浏览器不支持audio标签，请更换浏览器试试！</audio>
  </footer>

</template>
<script setup>

</script>


<style scoped>
@import url(../assets/css/wztb.css);
@import url(../assets/css/ys4.css);
</style>